<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dự Toán - Index</title>

		<link href="../styles/kendo.metro.min.css" rel="stylesheet">
        <link href="../styles/kendo.common.min.css" rel="stylesheet">
        <link href="../myStyles/myCSS.css" rel="stylesheet">
        <script src="../js/jquery.min.js"></script>
        <script src="../js/kendo.all.min.js"></script>
        
</head>

<body>
	<button id="click" value="Click" onclick="runit()">Click</button>
    <button id="click" value="Click Again" onclick="showit()">Click again</button>
	<div id="tieude"></div>
	<div id="grid"></div>
	<script>
		var check=0;
		var HangMuc = kendo.data.Model.define( {
			id: "id", // the identifier of the model
			fields: {
				"id": {
					type: "int",
				},
				"TenHM": {
					type: "string",
				}
			}
		});
		
		function showit()
		{
			grid.expandRow(grid.tbody.find(">tr.k-master-row:first"));
	
			
		}
		function runit()
		{
			if(check!=0) return;
			check++;
			
			//alert(thedata.at(1));	
			hm2 = new HangMuc({
				id: 5,
				TenHM: "New",	
			});
			hm = new HangMuc();
			hm = thedata.at(0);
			thedata.insert(0,hm2);
			
			//hm.
			//alert(hm2.get('id'));
			
		}
		var thedata = new kendo.data.DataSource(
			{
				transport: {
					//read: "phantichvattu.php?macv=AC.31110",	
					read: "danhsachhangmuc.php?mact=4"
				},	
				schema: {
					data: "data",
					model: HangMuc,
					
				},
				
				
			}
		);
        var grid = $("#grid").kendoGrid(
		 	{
		 		dataSource: thedata,
				
				columns: [{ field: "id" }, { field: "TenHM" }],
				/*/
				columns: [
							{title: "Ma Hieu", field: "MHDM", width: 70},
							{field: "TenCV", width: 250}, 
							{field: "DVT", width: 40},
							{field: "MVT", width: 50},
							{field: "HaoPhiVatTu", width: 40},
							
						],
				/*/
				//height: 300
		 
		 		editable: "true",
			}
		 );
    </script>
</body>
</html>